<%@page import="java.util.List"%>
<%@page import="com.situ.student.entity.Banji"%>
<%@page import="java.lang.reflect.Array"%>


<%@page import="org.apache.jasper.tagplugins.jstl.core.ForEach"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>       
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="lib/bootstrap-3.3.7-dist/css/bootstrap.css"/>
<script type="text/javascript" src="lib/jquery/jquery-1.11.1.js"></script>
<script type="text/javascript" src="lib/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
<script type="text/javascript"></script>
<style type="text/css">
		.align-center{
		    width: 800px;
			margin : 10px auto;
		}
		table{
			table-layout : fixed;
			word-break : break-all;
		}
	</style>
</head>
<body>
			<%-- <%
				List<Banji> list = (List<Banji>)request.getAttribute("list");
			%> --%>
			<!-- 拿到集合 -->
	
	<!-- 分完页千万不能忘 !!!!-->
	${requstScope.pageBean}
	<%-- ${requstScope.list} --%>
	<div class="align-center">
		<!-- 展示 -->		
		<a href="banji_add.jsp">添加</a>
		<a href="javascript:deleteAll()">批量删除</a>
		<form action="${pageContext.request.contextPath}/banji?method=pageList" method="post"></form>
		<form action="" id="mainForm" method="post">
			<table class="table table-striped table-bordered table-hover table-condensed">
			
				<tr>
					<td><input type="checkbox" id="selectAlls" onclick="selectAll()"/></td>
					<td>ID</td>	
					<td>班级</td>	
					<td>班级人数</td>	
					<td>教师</td>	
					<td>修改</td>	
					<td>删除</td>	
				</tr>
				
				<!-- for-each循环遍历 -->
				
				<!-- 分完页千万不能忘${pageBean.list}!!!! -->
				<c:forEach items="${pageBean.list}" var="banji">
				<tr>
					<td><input type="checkbox" name="selectIds" value="${banji.id}"></td>
					<td>${banji.id}</td>
					<td>${banji.name}</td>
					<td>${banji.people}</td>
					<td>${banji.teatch}</td>
					<td><a href="${pageContext.request.contextPath}/banji?method=toUpdate&id=${banji.id}">修改</a></td>
					<td><a href="javascript:deleteById(${banji.id})">删除</a></td>
				</tr>
				</c:forEach>
			</table>
			
			<nav aria-label="Page navigation">
			  <ul class="pagination">
			   	 
			   	 	<!-- 上一页 开始 -->
			  		<!--  如果当前已经是第一页，就不能点击上一页 -->
			     
			      <c:if test="${pageBean.pageNo == 1 }">
			      	  <li class="disabled">
			      		<a  href="#" aria-label="Previous">
				       		<span aria-hidden="true">&laquo;</span>
				   		</a>
				   	  </li>
			      </c:if>
			      <c:if test="${pageBean.pageNo != 1 }">
			      	  <li >
					      <a href="${pageContext.request.contextPath}/banji?method=pageList&pageNo=${pageBean.pageNo - 1}&pageSize=3" aria-label="Previous">
					      	<span aria-hidden="true">&laquo;</span>
					      </a>
					  </li>
			      </c:if>
			       <!-- 上一页 结束 -->
			       
			       <!-- 变量为i，初始为1，结束为最大页数 -->
			    	<c:forEach var="i" begin="1" end="${pageBean.totalPage}">
			   	 	<c:if test="${i == pageBean.pageNo }">
						<li class="active"><a href="#">${i}</a></li>
			    	</c:if>
			    	<c:if test="${i != pageBean.pageNo}">
						<li><a href="${pageContext.request.contextPath}/banji?method=pageList&pageNo=${i}&pageSize=3">${i}</a></li>
			    	</c:if>
			    	</c:forEach>
			    
			    
			     <!-- 下一页 开始 -->
			    	<c:if test="${pageBean.pageNo == pageBean.totalPage}">
			    		 <li class="disabled">
			      			<a  href="#" aria-label="Previous">
				        		<span aria-hidden="true">&raquo;</span>
				   			</a>
				   	  	</li>
			   		 </c:if>
			     	<c:if test="${pageBean.pageNo != pageBean.totalPage}">
			    	 	<li >
				      		<a href="${pageContext.request.contextPath}/banji?method=pageList&pageNo=${pageBean.pageNo + 1}&pageSize=3" aria-label="Previous">
				        		<span aria-hidden="true">&raquo;</span>
				      		</a>
				  		</li>
			     	</c:if>
			     <!-- 下一页 结束 -->
			  </ul>
			</nav>
		</div>
			
			
		</form>
	</div>
<!--bootstrap.js用到了jquery，所以要首先引入jquery -->
<script type="text/javascript">

	function deleteById(id) {
	//用户点了确定，confirm返回的是true，
	//用户点了取消，confirm返回的是false，
		var isDel = confirm("您确认要删除么？");
		if (isDel) {
			location.href = "${pageContext.request.contextPath}/banji?method=deleteById&id=" + id;
		} 
	}
	
	function selectAll(){
		//得到全选、反选按钮的状态
		var isChecked = $("#selectAlls").prop("checked");
		//下面的checkbox状态和最上面全选、反选的checkbox的状态一致
		$("input[name=selectIds]").prop("checked",isChecked);
	}
	
	function deleteAll(){
		$("#mainForm").attr("action", "${pageContext.request.contextPath}/banji?method=deleteAll");
		//用代码的方式提交表单
		$("#mainForm").submit();
		//页面提示
		var isDels = confirm("确认删除吗？");
		if(idDels){
			location.href = "${pageContext.request.contextPath}/banji?method=list" + all;			
		}
	}
</script>
</body>
</html>